var util = require("../../../libs/util.js");
import * as echarts from '../components/echarts';
var app = getApp();
var piecanvas = '',lineCanvas = '';
var that = this;
Page({

  /**
   * 页面的初始数据
   */
  data: {
    StatusBar: app.globalData.StatusBar,
    CustomBar: app.globalData.CustomBar,
    Custom: app.globalData.Custom,
    TabCur: -1,
    MainCur: 0,
    VerticalNavTop: 0,
    dataList: [{id:0,name:'暂无车辆'}],
    inputShowed: false,
    searchVal: "",
    ecpie: {
      onInit: function (canvas, width, height) {
        piecanvas = canvas;
        that.pieChart = echarts.init(canvas, null, {
          width: width,
          height: 200
        });
        canvas.setChart(that.pieChart);
        that.pieChart.setOption(initChartPie());
        return that.pieChart;
      }
    },
    ecline: {
      onInit: function (canvas, width, height) {
        var lineChart = echarts.init(canvas, null, {
          width: width,
          height: 300
        });
        canvas.setChart(lineChart);
        lineCanvas = lineChart;
        lineChart.setOption(initChartLine());

        return lineChart;
      }
    }
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (e) {
    var that = this;
    wx.getSystemInfo({
      success: res => {
        let custom = wx.getMenuButtonBoundingClientRect();
        that.setData({
          CustomBar: custom.bottom + custom.top - res.statusBarHeight,
          client_width: res.windowWidth,
          client_height: res.windowHeight
        })
      }
    })
    
    that.loadData();
  },
  loadData: function () {
    var that = this;
    wx.showLoading({
      title: '加载中',
    })
    util.getData("/atapi/vehicle/vehicle", {
      'CO_ID': app.globalData.CO_ID,
      'searchVal': that.data.searchVal
    }, function (res, error) {
      console.log(res); console.log(error)
      if (res.data.success) {
        var data = res.data.data[0], dataList = [];
        for (var i = 0; i < data.length;i++){
          dataList.push({
            id: data[i].ID,
            name: data[i].plate
          })
        }
        that.setData({
          dataList: dataList,
          count: res.data.data[1][0].COUNT
        });
      } else {
        that.setData({
          count: 0,
          dataList: [{ id: 0, name: '暂无车辆' }]
        });
      }
      wx.hideLoading();
    });
    initChartPieData()
  },
  showInput: function () {
    this.setData({
      inputShowed: true
    });
  },
  hideInput: function () {
    this.setData({
      searchVal: "",
      inputShowed: false
    });
    this.loadData();
  },
  clearInput: function () {
    this.setData({
      searchVal: ""
    });
    this.loadData();
  },
  inputTyping: function (e) {
    this.setData({
      searchVal: e.detail.value
    });
    this.loadData();
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})
function initChartPie(canvas, width, height) {
  var option = {
    backgroundColor: "#ffffff",
    color: ["#37A2DA", "#32C5E9"],
    legend: {
      left: 10,
      data: ['出车', '未出车']
    },
    series: [{
      label: {
        normal: {
          fontSize: 14
        }
      },
      type: 'pie',
      center: ['50%', '50%'],
      radius: [0, '60%'],
      data: [{
        value: 0,
        name: '出车'
      }, {
        value: 0,
        name: '未出车'
      }
      ],
      itemStyle: {
        emphasis: {
          shadowBlur: 10,
          shadowOffsetX: 0,
          shadowColor: 'rgba(0, 2, 2, 0.3)'
        }
      }
    }]
  };
  return option;
}
function initChartPieData(){
  util.getData("/atapi/vehicle/vehicle/vehicleDeliveryStats", {
    'CO_ID': app.globalData.CO_ID
  }, function (res, error) {
    console.log(res); console.log(error)
    var total_count = 0, work_count = 0, work_count_per = 0, nowork_count_per = 0;
    if (res.data.success) {
      total_count = res.data.data[0][0].total_count;
      work_count = res.data.data[1].length;
      work_count_per = (work_count / total_count) * 100;
      nowork_count_per = ((total_count - work_count) / total_count) * 100;
    }
    var option = {
      series: [{
        data: [{
          value: work_count_per,
          name: '出车' + work_count
        }, {
            value: nowork_count_per,
            name: '未出车' + (total_count - work_count)
        }
        ]
      }]
    };
    console.log(piecanvas)
    var pieChart = echarts.init(piecanvas, null, {
      width: '100%',
      height: 200
    });
    pieChart.setOption(option);
    
  });
}
function initChartLine(canvas, width, height) {
  var option = {
    backgroundColor: "#ffffff",
    title: {
      show: false
    },
    legend: {
      show: false
    },
    grid: {
      left: '15px',
      right: '15px',
      bottom: '15px',
      top: '15px',
      containLabel: true
    },
    color: ["#37A2DA", "#67E0E3", "#9FE6B8"],
    tooltip: {
      show: true,
      trigger: 'axis'
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
      // show: false
    },
    yAxis: {
      x: 'center',
      type: 'value',
      splitLine: {
        lineStyle: {
          type: 'dashed'
        }
      },
      show: true
    },
    series: [{
      name: '出车',
      type: 'line',
      smooth: true,
      data: [18, 36, 65, 30, 78, 40, 33]
    }]
  };
  return option;
}